{% extends 'admin/public/layout.html' %}

{% block style %}
<style>
    .layui-btn-scan {
        position: absolute;
        right: 1%;
        top: 10px;
    }
</style>
{% endblock %}

{% block body %}
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">
                    文件列表
                </div>
                <div class="layui-card-body">
                    <table class="layui-hide" id="list-table" lay-filter="list-table">
                        <thead>
                            <tr>
                                <th lay-data="{field:'name', sort: true}">文件</th>
                                <th lay-data="{field:'size', width:100, sort: true}">大小</th>
                                <th lay-data="{field:'lastModifiedDateTime', width:200, sort: true}">修改时间</th>
                                <th lay-data="{field:'operation', width:160}">操作</th>
                            </tr>
                        </thead>
                        <tbody id="layer-photos">
                            {% for v in data %}
                            <tr>
                                <td>
                                    {% if v.folder%}
                                    <a href="{% if v.folder%}{{current_url}}/{{v.name}}{% else %}javasript:void(0);{% endif %}">
                                        <i class="fa fa-folder"></i>
                                        {{ v.name }}
                                    </a>
                                    {% else %}
                                        {% if v.file.mimeType == "video/mp4" %}
                                            <a href="javasript:void(0);" onclick="openvideo('{{ v.thumbnails[0].large.url }}');">
                                                <i class="fa fa-video-camera"></i>
                                                {{ v.name }}
                                            </a>
                                        {% elif v.file.mimeType == "image/jpeg" %}
                                            <a href="javasript:void(0);" onclick="openimage('{{ v.thumbnails[0].large.url }}');">
                                                <i class="fa fa-file-photo-o"></i>
                                                {{ v.name }}
                                            </a>
                                        {% elif v.file.mimeType == "application/zip" %}
                                            <a href="javasript:void(0);">
                                                <i class="fa fa-file-zip-o"></i>
                                                {{ v.name }}
                                            </a>
                                        {% elif v.file.mimeType == "application/vnd.openxmlformats-officedocument.wordprocessingml.document" %}
                                            <a href="javasript:void(0);">
                                                <i class="fa fa-file-word-o"></i>
                                                {{ v.name }}
                                            </a>
                                        {% elif v.file.mimeType == "application/octet-stream" %}
                                            <a href="javasript:void(0);">
                                                <i class="fa fa-font"></i>
                                                {{ v.name }}
                                            </a>
                                        {% else %}
                                            <a href="javasript:void(0);">
                                                <i class="fa fa-file"></i>
                                                {{ v.name }}
                                            </a>
                                        {% endif %}
                                    {% endif %}
                                </td>
                                <td>
                                    {{ v.size }}
                                </td>
                                <td>
                                    {{ v.lastModifiedDateTime }}
                                </td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block script %}
<script>
    layui.use(['layer', 'table', 'form'], function(){
        var $ = layui.$;
        var form = layui.form;
        var table = layui.table;



        // 静态表格
        table.init('list-table', {
            height: 500 //设置高度
            ,page: true //开启分页
        });

        // 相册弹出层
        openimage = function(url){
            var img_infor = "<img src='" + url + "' />";
            layer.open({
                type: 1,
                title: false,
                closeBtn: 0,
                shadeClose: true,
                content: img_infor,
                success: function (layero, index) {
                    parent.layer.iframeAuto(index);
                }
            });
        };

        // 视频弹出层
        openvideo = function(url){
            var video_infor = "<video src='" + url + "' />";
            layer.open({
                type: 1,
                title: false,
                closeBtn: 0,
                skin: 'layui-layer-nobg', //没有背景色
                shadeClose: true,
                content: video_infor
            });
        };



    });
</script>
{% endblock %}